<template>
  <div>
    <el-dialog :visible.sync="dialog.detail" title="详情" width="80%" append-to-body>
      <div class="detail-info">
        <el-row>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <span class="detail-title">用户手机号：</span>
            <span v-text="form.userPhone" />
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <span class="detail-title">用户昵称：</span>
            <span v-text="form.userNickname" />
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <span class="detail-title">用户是否可用：</span>
            <span v-text="form.userIsActive" />
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <span class="detail-title">IP地址：</span>
            <span v-text="form.executeIp" />
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <span class="detail-title">操作类型：</span>
            <span v-text="form.executeType" />
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <span class="detail-title">执行说明：</span>
            <span v-text="form.description" />
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <span class="detail-title">User-Agent：</span>
            <span v-text="form.userAgent" />
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <span class="detail-title">请求URL：</span>
            <span v-text="form.requestUrl" />
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <span class="detail-title">请求方式：</span>
            <span v-text="form.requestMethod" />
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <span class="detail-title">请求参数：</span>
            <span v-text="form.requestParams" />
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <span class="detail-title">响应编码：</span>
            <span v-text="form.responseCode" />
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <span class="detail-title">响应消息：</span>
            <span v-text="form.responseMsg" />
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <span class="detail-title">完整类名：</span>
            <span v-text="form.executeClass" />
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <span class="detail-title">方法名称：</span>
            <span v-text="form.executeMethod" />
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <span class="detail-title">开始执行时间：</span>
            <span v-text="form.executeTime" />
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <span class="detail-title">执行耗时(ms)：</span>
            <span v-text="form.executeCostTime" />
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <span class="detail-title">是否异常：</span>
            <span v-text="form.hasException" />
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <span class="detail-title">异常消息：</span>
            <span v-text="form.exceptionMsg" />
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <span class="detail-title">版本号：</span>
            <span v-text="form.version" />
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <span class="detail-title">创建时间：</span>
            <span v-text="form.createTime" />
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <span class="detail-title">更新时间：</span>
            <span v-text="form.updateTime" />
          </el-col>
          <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
            <span class="detail-title">是否可用：</span>
            <span v-text="form.isActive" />
          </el-col>
        </el-row>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="dialog.detail = false">关闭</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import * as utils from '@/utils/utils'
import * as ResponseStatus from '@/utils/response-status'
const resUrl = process.env.VUE_APP_RES_URL
export default {
  name: 'SysLogDetail',
  data() {
    return {
      dialog: {
        detail: false
      },
      form: {
        id: undefined,
        userId: undefined,
        userPhone: undefined,
        userNickname: undefined,
        userIsActive: undefined,
        executeIp: undefined,
        executeType: undefined,
        description: undefined,
        userAgent: undefined,
        requestUrl: undefined,
        requestMethod: undefined,
        requestParams: undefined,
        responseCode: undefined,
        responseMsg: undefined,
        executeClass: undefined,
        executeMethod: undefined,
        executeTime: undefined,
        executeCostTime: undefined,
        hasException: undefined,
        exceptionMsg: undefined,
        version: undefined,
        createTime: undefined,
        updateTime: undefined,
        isActive: undefined
      },
      dataDictCodes: ['YES_NO', 'EXECUTE_TYPE'],
      resUrl: resUrl
    }
  },
  computed: {},
  mounted() {},
  methods: {
    getDictItemsDisplayValue() {
      utils
        .getDataDict(this.dataDictCodes)
        .then(response => {
          if (response) {
            if (response) {
              utils.getDetailDictItemDisplayValue({
                mainComponent: this,
                dataDictItems: response,
                dictCode: 'YES_NO',
                formProp: 'userIsActive'
              })
              utils.getDetailDictItemDisplayValue({
                mainComponent: this,
                dataDictItems: response,
                dictCode: 'EXECUTE_TYPE',
                formProp: 'executeType'
              })
              utils.getDetailDictItemDisplayValue({
                mainComponent: this,
                dataDictItems: response,
                dictCode: 'YES_NO',
                formProp: 'hasException'
              })
              utils.getDetailDictItemDisplayValue({
                mainComponent: this,
                dataDictItems: response,
                dictCode: 'YES_NO',
                formProp: 'isActive'
              })
            }
          }
        })
        .catch(error => {
          console.log(error)
        })
    }
  }
}
</script>

<style>
</style>
